<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title><#if pageTitle??>${pageTitle}</#if>出租屋管理系统-设备监控</title>
<#assign current="rt_device">
<#include "../common/page_head.ftl">

<style>
.all_door{
	padding: 15px;
	background: write;
	height: 200px;
	margin:auto auto !important;
	SCROLLBAR-FACE-COLOR:#EFF4F9;
	font-size:10pt;
	SCROLLBAR-HIGHLIGHT-COLOR:#C9D9F1;
	OVERFLOW:auto;
	SCROLLBAR-SHADOW-COLOR:#FFFFFF;
	SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
	SCROLLBAR-ARROW-COLOR:#000000;
	SCROLLBAR-TRACK-COLOR:#EFF4F9;
	SCROLLBAR-DARKSHADOW-COLOR:#C9D9F1;
	text-align:left;
	color:#002280;
}
.event_div{
	padding: 15px;
	background: gainsboro;
	height: 200px;
	margin:auto auto !important;
	SCROLLBAR-FACE-COLOR:#EFF4F9;
	font-size:10pt;
	SCROLLBAR-HIGHLIGHT-COLOR:#C9D9F1;
	OVERFLOW:auto;
	SCROLLBAR-SHADOW-COLOR:#FFFFFF;
	SCROLLBAR-3DLIGHT-COLOR:#FFFFFF;
	SCROLLBAR-ARROW-COLOR:#000000;
	SCROLLBAR-TRACK-COLOR:#EFF4F9;
	SCROLLBAR-DARKSHADOW-COLOR:#C9D9F1;
	text-align:left;
	color:#002280;
}
.event_ul{
	padding-left: 20px;
	padding-top: 10px;
	}
</style>
</head>
<body>

    <div style="height: 60px; overflow: hidden">
		<#include "../common/u_top.ftl">
    </div>
    
    <div id="frame_side">
    <#include "../common/u_login_info.ftl">
    <#include "../common/u_left_menu.ftl">
    </div>
    
    <div id="body_box">
    <table cellpadding="0" cellspacing="0" border="0" class="icon">
        <tr>
            <td>
            </td>
        </tr>
    </table>
    
    <table cellpadding="0" cellspacing="0" border="0" class="table">
		<tbody>
			<tr>
				<td valign="top" align="right">
					<form action="" method="get" name="search" id="search">
					<table cellpadding="0" cellspacing="6" border="0">
						<tbody>
						<tr>							
							<td></td>
						</tr>
					</tbody></table>			
					</form>
				</td>
			</tr>
		</tbody>
	</table>
	
	<div class="rounded table">
    <form action="" method="get" name="search_form" id="search_form">
        <table width="100%" cellpadding="0" cellspacing="0" border="0" class="box_top">
            <tr>
                <td class="title">设备列表</td>
                <td><div>
                	<span>设备序列号：</span><input type="text" name="deviceSn" />
                	<span>设备名称：</span><input type="text" name="deviceName" />
                	<a class="" href="javascript:;" onclick="add();">搜索</a>
                	</div>
                </td>
            </tr>
        </table>
    </form>
    <div class="all_door">
	<#if pageData??>
		<#if pageData.pageData??>
		<#list pageData.pageData as f18Device>
	    <div class="door">
	    	<img id="door_img_${f18Device.deviceSn}" alt="${f18Device.deviceName}" src="/images/door_offline.jpg">
	    	<span>${f18Device.deviceName}</span>
	    </div>
	    </#list>
	    </#if>
	</#if>
	</div>
	
	<div class="rounded">
		<table width="100%" cellpadding="0" cellspacing="0" border="0" class="box_top">
		    <tr>
		        <td class="title">实时事件</td>
		    </tr>
		</table>
	</div>
	
	<div class="event_div">
		<ul id="event_ul_id" class="event_ul">
		<#list 1..5 as t>
		 	<li id="li_${t}">实时监控事件记录</li>
		</#list>
		</ul>
	</div>
	
	
	<script type="text/javascript">
	function listening(){
		var ul=document.getElementById("event_ul_id"); 
		var li= document.createElement("li");
		li.innerHTML="实时监控事件记录1"; 
		ul.appendChild(li);
	} 
	//重复执行某个方法 
	var t1 = window.setInterval(listening,1000); 
	</script>
	
	
	
	
	
	
	
	
	
    </div>
	<#include "../common/u_bottom.ftl">
    </div>
</body>
</html>